import React from 'react'
import ReactDOM from 'react-dom';

export default function Demo() {
  const [count,setCount] = React.useState(0)

  const myRef = React.useRef()

  React.useEffect( ()=>{
    let timer = setInterval(() => {
      console.log('111');
      setCount( count => count+1 )
    }, 1000);
    return ()=>{
      clearInterval(timer)
    }
  },[])

  const add = ()=>{
    // setCount(count+1)
    setCount( count => count+1 )
  }

  function unmount() {
    ReactDOM.unmountComponentAtNode( document.querySelector('#root') )
  }

  function show() {
    alert(myRef.current.value)
  }
  
  return (
    <div>
      <input ref={myRef} />
      <h2>当前求和为：{count}</h2>
      <button onClick={add} >点我加一</button>
      <button onClick={unmount} >点我销毁</button>
      <button onClick={show} >弹窗</button>
    </div>
  )
}